<!-- MyWithModalComponent.vue -->
<template>
  <h2>With Modal component</h2>
  <button @click="openModal = true">Open modal</button>
  <Modal :open="openModal" title="Hello world" @closeDialog="toggleModal"/>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import Modal from "./MyModal.vue"

export default defineComponent({
  name: "WithModalComponent",
  components: {
    Modal,
  },
  data() {
    return {
      openModal: false,
    };
  },
  methods: {
    toggleModal(newValue: boolean) {
      this.openModal = newValue;
    }
  },
});
</script>
